<template>
  <div class="hello">
    HelloWorld
    <p>this is vue3 with vite</p>
    <p>build from vue3 + vuex@4 + vue-router@4 + axios + less</p>
    <Button type="primary" @click="show = true">主要按钮</Button>
    <Button type="primary" @click="toxxx">权限日历</Button>
    <Icon name="cross" />
    <Calendar v-model:show="show" />

    <p v-permission="['admin', 'stu']">测试自定义指令</p>
    <!-- 如果有参数就是这么传 -->
    <p v-throttle="clHandleCanshu.bind(null, maidian)">看看能不能放函数进去</p>
    <p v-throttle="clHandle">看看能不能放函数进去</p>
  </div>
</template>

<script setup>
import { ref } from "vue";
import { Button, Icon, Calendar } from "vant";
import { useRouter } from "vue-router";
// import PCA from 'area-data/pca'; //仅有省市
import PCAA from 'area-data/pcaa'; 

const router = useRouter();
// console.log(PCAA)
// !
// todo
// ?
// *
// ~
const maidian = ref({
  key: 1000,
  module: "page",
  data: { sdfsd: 121, dsfsdf: 66 },
});
const clHandle = () => {
  console.log(maidian.value);
};
const clHandleCanshu = (item) => {
  console.log(item);
};
const show = ref(false);

const toxxx = ()=>{
    router.push({
    path: "/rili",
  });
}

</script>

<style lang="less" scoped>
.hello {
  width: 100%;
  min-height: 100vh;
  text-align: center;
  font-size: 48px;
  padding-top: 60px;
  p {
    padding-top: 20px;
    padding-left: 5px;
    padding-right: 5px;
    line-height: 60px;
  }
}
</style>